<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="/WEB-INF/templates/BasicTemplate.xhtml">

	<ui:define name="content">
		<f:event type="preRenderView"
			listener="#{userController.beforeSearch}" />

		<div class="title ui-widget-header ui-corner-all">
			<h:panelGrid style="margin:auto;">
		BUSCAR USUARIOS
		</h:panelGrid>

		</div>

		<h:form id="formSearch">
			<h:panelGrid style="margin:auto;">
			
				<h:panelGrid style="margin:auto;text-align:center;">
					<p:messages id="messages"></p:messages>
				</h:panelGrid>
				
				<h:panelGrid columns="4">

					<p:outputLabel value="Documento de identidad"></p:outputLabel>
					<p:inputText style="width: 180px;"
						value="#{userController.documentNumberSearch}"></p:inputText>

					<p:outputLabel value="Usuario"></p:outputLabel>
					<p:inputText style="width: 180px;"
						value="#{userController.usernameSearch}"></p:inputText>

					<p:outputLabel value="Nombres"></p:outputLabel>
					<p:inputText style="width: 180px;"
						value="#{userController.firstnameSearch}"></p:inputText>

					<p:outputLabel value="Departamento"></p:outputLabel>
					<p:selectOneMenu id="departments"
						value="#{userController.departmentSelected}">
						<f:selectItem itemValue="0" itemLabel="Todos"></f:selectItem>
						<f:selectItems value="#{userController.departments}"></f:selectItems>
						<p:ajax listener="#{userController.searchSubDepartments}"
							update=":formSearch:subDepartments :formSearch:messages"></p:ajax>
					</p:selectOneMenu>

					<p:outputLabel value="Apellidos"></p:outputLabel>
					<p:inputText style="width: 180px;"
						value="#{userController.lastnameSearch}"></p:inputText>



					<p:outputLabel value="SubDepartamento"></p:outputLabel>
					<p:selectOneMenu id="subDepartments"
						value="#{userController.subDepartmentSelected}">
						<f:selectItem itemValue="0" itemLabel="Todos"></f:selectItem>
						<f:selectItems value="#{userController.subDepartments}"></f:selectItems>
					</p:selectOneMenu>

				</h:panelGrid>
				<h:panelGrid style="margin:auto;text-align:center;">
					<p:commandButton icon="ui-icon-search"
						actionListener="#{userController.search}" value="Buscar"
						process="@form"
						update=":formSearch:usersTable :formSearch:messages :formSearch:userId :formSearch:editButtom">
					</p:commandButton>
				</h:panelGrid>
			</h:panelGrid>

			<h:panelGrid columns="3">
				<p:commandButton icon="ui-icon-plus" value="Agregar"
					action="add_user.xhtml">
				</p:commandButton>

				<p:commandButton id="editButtom" action="edit_user.xhtml"
					icon="ui-icon-pencil" value="Editar"
					disabled="#{userController.userSelected==null}">
					<f:param name="userId" value="#{userController.userSelected.id}"></f:param>
				</p:commandButton>
				<p:outputLabel id="userId"
					value="Usuario seleccionado: #{userController.userSelected!=null?userController.userSelected.id:''}">
				</p:outputLabel>
			</h:panelGrid>


			<p:dataTable value="#{userController.users}" var="u" rowKey="#{u.id}"
				paginator="true" rows="10" id="usersTable" selectionMode="single"
				selection="#{userController.userSelected}">

				<f:facet name="header">
					<p:outputLabel value="Usuarios"></p:outputLabel>
				</f:facet>

				<p:ajax event="rowSelect"
					update=":formSearch:userId :formSearch:editButtom" />
				<p:ajax event="rowUnselect"
					update=":formSearch:userId :formSearch:editButtom" />

				<p:column headerText="ID" sortBy="#{u.id}">
					<h:outputText value="#{u.id}"></h:outputText>
				</p:column>

				<p:column headerText="USERNAME" sortBy="#{u.username}">
					<h:outputText value="#{u.username}"></h:outputText>
				</p:column>

				<p:column headerText="¿ACTIVO?" sortBy="#{u.isActive}">
					<h:outputText value="#{u.isActive}"></h:outputText>
				</p:column>

				<p:column headerText="DNI" sortBy="#{u.person.documentNumber}">
					<h:outputText value="#{u.person.documentNumber}"></h:outputText>
				</p:column>

				<p:column headerText="NOMBRES" sortBy="#{u.person.firstname}">
					<h:outputText value="#{u.person.firstname}"></h:outputText>
				</p:column>

				<p:column headerText="APELLIDOS" sortBy="#{u.person.lastname}">
					<h:outputText value="#{u.person.lastname}"></h:outputText>
				</p:column>

				<p:column headerText="SUBDEPARTAMENTO"
					sortBy="#{u.person.department.name}">
					<h:outputText value="#{u.person.department.name}"></h:outputText>
				</p:column>

				<p:column headerText="DEPARTAMENTO"
					sortBy="#{u.person.department.department.name}">
					<h:outputText value="#{u.person.department.department.name}"></h:outputText>
				</p:column>


			</p:dataTable>


		</h:form>
	</ui:define>

</ui:composition>
</html>
